$(document).ready(function() {
    console.log('API模态框加载器初始化');
    
    // 当API模态框显示时加载API列表
    $('#addApiToSceneModal').on('show.bs.modal', function (e) {
        console.log('API模态框显示，开始加载API列表');
        $('#api-search').val(''); // 清空搜索框
        loadSceneApiList(); // 加载API列表
    });
    
    // 当API模态框隐藏时清空列表
    $('#addApiToSceneModal').on('hide.bs.modal', function (e) {
        console.log('API模态框隐藏，清空API列表');
        $('#api-list').empty().html('<div class="alert alert-info">搜索API列表，下次打开时重新加载</div>');
    });

    // 初始化API列表搜索功能
    $('#api-search-btn').on('click', function() {
        const keyword = $('#api-search').val().trim();
        loadSceneApiList(keyword);
    });

    $('#api-search').on('keypress', function(e) {
        if (e.which === 13) { // Enter键
            const keyword = $(this).val().trim();
            loadSceneApiList(keyword);
        }
    });

    console.log('API搜索功能初始化完成');
});

// 加载场景API列表
function loadSceneApiList(keyword = '') {
    console.log('加载场景API列表，搜索关键词:', keyword);

    $.ajax({
        url: '/api/data',
        type: 'GET',
        data: {
            per_page: 1000,
            search: keyword
        },
        dataType: 'json', // 明确指定数据类型为JSON
        success: function(response) {
            console.log('API列表加载成功:', response);
            console.log('API响应类型:', typeof response);
            console.log('API响应是否包含items属性:', response.hasOwnProperty ? response.hasOwnProperty('items') : '无法检测');
            console.log('API响应是否为数组:', Array.isArray(response));
            console.log('renderSceneApiList函数是否存在:', typeof renderSceneApiList === 'function');
            
            // 处理各种可能的响应格式
            let apiItems = [];
            
            // 格式1: {apis: [...], pagination: {...}}  <-- 实际返回的格式
            if (response && response.apis) {
                apiItems = response.apis;
                console.log('识别到格式1（实际返回的格式），apis数量:', apiItems.length);
            }
            // 格式2: {items: [...], pagination: {...}}  <-- 我们之前期望的格式
            else if (response && response.items) {
                apiItems = response.items;
                console.log('识别到格式2，items数量:', apiItems.length);
            }
            // 格式3: 直接是数组 [...]
            else if (Array.isArray(response)) {
                apiItems = response;
                console.log('识别到格式3，数组长度:', apiItems.length);
            }
            // 格式4: {success: true, data: {items: [...]}}
            else if (response && response.success && response.data && response.data.items) {
                apiItems = response.data.items;
                console.log('识别到格式4，items数量:', apiItems.length);
            }
            // 格式5: {success: true, data: [...]}  
            else if (response && response.success && Array.isArray(response.data)) {
                apiItems = response.data;
                console.log('识别到格式5，数组长度:', apiItems.length);
            }
            // 格式6: {data: {items: [...]}}
            else if (response && response.data && response.data.items) {
                apiItems = response.data.items;
                console.log('识别到格式6，items数量:', apiItems.length);
            }
            // 格式7: {data: [...]}  
            else if (response && response.data && Array.isArray(response.data)) {
                apiItems = response.data;
                console.log('识别到格式7，数组长度:', apiItems.length);
            }
            else {
                console.error('无法识别的API响应格式:', response);
                console.log('响应对象的完整结构:', JSON.stringify(response));
                $('#api-list').html('<div class="alert alert-danger">加载API列表失败: 响应格式不正确</div>');
                return;
            }
            
            // 渲染API列表
            if (typeof renderSceneApiList === 'function') {
                console.log('准备渲染API列表');
                renderSceneApiList(apiItems);
            } else {
                console.error('renderSceneApiList函数未定义');
                $('#api-list').html('<div class="alert alert-danger">加载API列表失败: renderSceneApiList函数未定义</div>');
            }
        },
        error: function(xhr, status, error) {
            console.error('API列表加载错误:', error);
            console.error('错误详情:', { status: xhr.status, statusText: xhr.statusText, responseText: xhr.responseText });
            
            // 尝试手动解析响应文本
            try {
                const response = JSON.parse(xhr.responseText);
                console.log('手动解析的响应:', response);
            } catch (e) {
                console.error('响应文本解析失败:', e);
            }
            
            $('#api-list').html('<div class="alert alert-danger">加载API列表失败: ' + error + '</div>');
        }
    });
}